define(["jquery"],function(){
$.fn.extend({
	hoverdir : function(){
		$(this).hover(function(e){
			var mouse = {x:e.offsetX, y:e.offsetY};
			
			var left = {
				dir : 3,
				val : mouse.x/$(this).outerWidth()
			};
			var right = {
				dir : 1,
				val : ($(this).outerWidth()-mouse.x)/$(this).outerWidth()
			};
			var up = {
				dir : 0,
				val : mouse.y/$(this).outerHeight()
			};
			var down = {
				dir : 2,
				val : ($(this).outerHeight()-mouse.y)/$(this).outerHeight()
			}
		
			var list = [left,right,up,down];
			list.sort(function(a,b){
				return a.val - b.val;
			});
			
			switch(list[0].dir) {
				case 0 : {
					$(this).find("div").css({left:0, top: "-100%"}).animate({top:0},500);
					break;
				}
				case 1 : {
					$(this).find("div").css({left:"100%", top:0}).animate({left:0},500);
					break;
				}
				case 2 : {
					$(this).find("div").css({left:0, top: "100%"}).animate({top:0},500);
					break;
				}
				case 3 : {
					$(this).find("div").css({left:"-100%", top:0}).animate({left:0},500);
					break;
				}
			}
			
		},function(e){
			var mouse = {x:e.offsetX, y:e.offsetY};
			var left = {
				dir : 3,
				val : mouse.x/$(this).outerWidth()
			};
			var right = {
				dir : 1,
				val : ($(this).outerWidth()-mouse.x)/$(this).outerWidth()
			};
			var up = {
				dir : 0,
				val : mouse.y/$(this).outerHeight()
			};
			var down = {
				dir : 2,
				val : ($(this).outerHeight()-mouse.y)/$(this).outerHeight()
			}
			var list = [left,right,up,down];
			list.sort(function(a,b){
				return a.val - b.val;
			});
			
			switch(list[0].dir) {
				case 0 : {
					$(this).find("div").animate({top:"-100%"},500);
					break;
				}
				case 1 : {
					$(this).find("div").animate({left:"100%"},500);
					break;
				}
				case 2 : {
					$(this).find("div").animate({top:"100%"},500);
					break;
				}
				case 3 : {
					$(this).find("div").animate({left:"-100%"},500);
					break;
				}
			}
		})
	}
});
});